<template>
<div class="container">
     
      <div style="height:150px"></div>

      <!-- 版心 -->
      <div class="center">
        <!-- 商品详细页div -->
        <!-- 整体div -->
        <div class="car_details">
          <!-- 左侧商品图片 -->
          <div class="car_details_left">
            <!-- 大图 -->
            <div>
              <img src="../../public\zxdc_pic\haibao_big.png" alt="" />
            </div>

            <div class="car_details_lg_img">
              <img src="../../public\zxdc_pic\car_img_lg1.png" alt="" />
              <img src="../../public\zxdc_pic\car_img_lg2.png" alt="" />
              <img src="../../public\zxdc_pic\car_img_lg3.png" alt="" />
            </div>
          </div>

          <!-- 右侧详细信息 -->
          <div class="car_details_right">
            <h3>海豹</h3>
            <div class="price">
              <div class="price-text">
                <span> 预售价（综合补贴后）</span>
              </div>
              <div class="price-number">
                <span> 26.78</span>
                <span>万</span>
              </div>
            </div>

            <!-- 车辆规格 -->
            <div class="car_spec">
              <div class="car_text">车型</div>
              <div class="car_list">
                <span>550km标准续航后驱版精英型</span>
                <span>550km标准续航后驱版尊贵型</span>
                <span>700km长续航后驱版</span>
                <span>650km四驱性能版</span>
              </div>
            </div>
            <!-- 车辆颜色 -->
            <div class="car_color">
              <div class="car_color_text">颜色</div>
              <div class="color_item">
                <div>
                  <img src="../../public\zxdc_pic\car_color_1.png" alt="" />
                  <p>北冰蓝</p>
                </div>
                <div>
                  <img src="../../public\zxdc_pic\car_color_2.png" alt="" />
                  <p>亚特兰蒂斯灰</p>
                </div>
                <div>
                  <img src="public\zxdc_pic\car_color_3.png" alt="" />
                  <p>极光白</p>
                </div>
                <div>
                  <img src="../../public\zxdc_pic\car_color_4.png" alt="" />
                  <p>玄空黑</p>
                </div>
              </div>
            </div>
            <!-- 车辆地址 -->
            <div class="car_address">
              <div class="car_city_text">地区</div>
              <input
                class="input1"
                type="select"
                value=""
                placeholder="请选城市"
              />
              <!-- 车辆门店信息 -->
              <div class="jxs_text">经销商</div>
              <input
                class="input2"
                type="select"
                value=""
                placeholder="请选择经销商"
              />
            </div>
            <button class="btn_ddty">到店体验</button>
          </div>
        </div>

        <!-- 详细浏览信息 -->
        <div class="car_view">
          <div class="gs">
            <span class="gs1">概览</span>
          </div>
          <div class="xqjs">
            <span class="xqjs1">详情介绍</span>
          </div>
          <div class="gmlc">
            <span class="gmlc1">购买流程</span>
          </div>
        </div>
        <img src="../../public\zxdc_pic\car_view-1.png" alt="" />
        <img src="../../public\zxdc_pic\car_view-2.png" alt="" />
        <img src="../../public\zxdc_pic\car_view-3.png" alt="" />
      </div>
     

      
    </div>

  
</template>

<script>

  export default {
    
  }
</script>
<style scoped src="../../public/zxdc.css/线上订车.css"></style>

<style lang="scss" scoped>

</style>